<template>
	<view class="add-to-cart white_b padding-15">
		<view class="flex">
			<view class="good-img r-5">
				<image class="r-5 image" :src="imgRemote+ware.main_image" mode="widthFix"></image>
			</view>
			<view class="flex-full">
				<view class="right close-icon" @click="close">
					<text class="iconfont iconguanbi2" style="font-size: 60rpx;"></text>
				</view>
				<view class="" style="width: 90%;">
					<view class="bold fs-18 two-line">{{ware.name}}</view>
					<view class="red-font bold" style="margin:20rpx 0;">
						<text class="fs-13">￥</text>
						<text class="fs-23" v-if="start">{{ware.sku[kind].activity_price}}</text>
						<text class="fs-23" v-else>{{ware.sku[kind].market_price}}</text>
					</view>
					 <view>库存：{{ware.sku[kind].stock}} </view> 
				</view>
			</view>
		</view>
		<view>
			<view class="bold">
				规格
			</view>
			<view class="fs-13 attr">
				<text v-for="(item,index) in ware.sku" :key="index" @click="selectAttr(index)" class="text-label"
					:class="kind==index?'active':''">
					{{item.guige}}
				</text>
			</view>
		</view>
		<view class="flex_left_right buy-num">
			<text class="bold">数量</text>
			<my-stepper :val="num" @plus="plus" @minus="minus" @input="input"
				:disabled="ware.sku[kind].bei_num?true:false"></my-stepper>
		</view>
		<view class="attr-cart" @click="addCart" v-if="type==1">
			加入购物车
		</view>
		<view class="attr-cart" @click="addCarts" v-if="type==2">
			立即购买
		</view>
	</view>
</template>
<script>
	const app = getApp().globalData;
	const {

		imgRemote
	} = app;

	export default {
		props: ['ware', 'start', 'type'],
		data() {
			return {
				kind: 0,
				num:1,
				imgRemote: imgRemote

			}
		},
		watch: {
			ware(newval) {
				console.log(newval)
				this.num = newval.sku[0].bei_num ? newval.sku[0].bei_num : 1
			}
		},

		methods: {
			selectAttr(index) {
				this.kind = index;
				this.num = this.ware.sku[index].bei_num ? this.ware.sku[index].bei_num : 1;
			},
			plus(val) {
				let add = this.ware.sku[this.kind].bei_num ? this.ware.sku[this.kind].bei_num : 1
				this.num += add;
				console.log(val)
			},
			input(e) {

				if (e.value) {
					this.num = e.value;
				} else {
					this.num = parseInt(0);
				}

			},
			minus(val) {
				let add = this.ware.sku[this.kind].bei_num ? this.ware.sku[this.kind].bei_num : 1
				if (val == add) {
					this.num == add;
				} else {
					this.num -= add;
				}
			},
			close() {
				this.kind = 0;
				this.num = 1;
				this.$emit('close')
			},
			addCarts() {

				let param = {
					token: uni.getStorageSync('userToken'),
					goods_id: this.ware.id,
					buy_num: this.num,
					admin_id:this.ware.admin_id,
					sku_id:this.ware.sku[this.kind].id
				};

				this.$get(this.$api.isBuy, param, (res) => {
					let {
						data
					} = res;
			     	if (data.code == 1) {

						//this.$project.common(data.data);

						//if (data.data.audit_status == 2) {

							let params = {
								sku_id: this.ware.sku[this.kind].id,
								goods_id: this.ware.id,
								buy_num: this.num,
								type: 2
							}

							uni.setStorageSync('selectGoods', params);
							uni.navigateTo({
								url: "/pages/shopcart/shoplist?type=2"
							})
							this.close();

						}else{
							this.$Toast(data.msg)
						}


					
				});







			},
			addCart() {

				let param = {
					token: uni.getStorageSync('userToken')
				};


				this.$get(this.$api.userInfo, param, (res) => {
					let {
						data
					} = res;
					if (data.code == 1) {

						//this.$project.common(data.data);

						//if (data.data.audit_status == 2) {

							let params = {
								token: uni.getStorageSync('userToken'),
								sku_id: this.ware.sku[this.kind].id,
								goods_id: this.ware.id,
								buy_num: this.num
							}
							this.$get(this.$api.cartAdd_cart, params, (res) => {
								let {
									data
								} = res;
								if (data.code == 1) {
									this.$Toast('加入购物车成功');
									this.close();
								} else {
									this.$Toast(data.msg);
								}
							});

						//}


					}
				});

			}
		}
	}
</script>
<style lang="scss" scoped>
	.add-to-cart {
		// position: fixed;bottom: 0;
		// width:calc(100vw - 60rpx);
		border-radius: 20rpx 20rpx 0 0;
		padding-bottom: 40rpx;

		.good-img {

			margin-top: -100rpx;
			background: white;

			.image {
				width: 240rpx;
				height: 240rpx;
				margin: 20rpx;
				box-sizing: border-box;
			}
		}

		.close-icon {
			margin-top: 30rpx;
		}

		.close {
			border: 4rpx solid #999;
			border-radius: 50%;
			color: #999;
			display: inline-block;
			width: 40rpx;
			height: 40rpx;
			text-align: center;
			line-height: 40rpx;
		}

		.attr {
			.text-label {
				padding: 10rpx 51rpx;
				border: 1px solid #999;
				display: inline-block;
				margin: 30rpx 30rpx 0 0;
				border-radius: 60rpx;
				box-sizing: border-box;
			}

			.active {
				border: 1px solid #FF7133;
				color: #FF7133;
			}
		}

		.buy-num {
			margin: 20rpx 0 30rpx;

		}

		.attr-cart {
			height: 78rpx;
			line-height: 78rpx;
			text-align: center;
			background: #e34b0f;
			color: white;
			border-radius: 39rpx;

		}

		.my_stepper {
			width: 200px !important;
			height: 100px !important;
			border-radius: 39rpx !important;
			// justify-content: space-between !important;
			// padding: 0 25rpx !important;
			// box-sizing: border-box;

			// .iconfont {
			// 	font-size: 50rpx;
			// }
		}
	}
</style>